スマートフォンからガラケーへのコンテンツ変換の検証結果（その１）

先般より変換エンジンの検証を行ってきましたが、その検証順序を下記に纏めました。（ここまで来るのに相当いろんなことをやってしまったので、検証が進展した時のポイントをまとめています。）

検証に使っている変換エンジンはRoundAboutと言う製品です。検証は下記を行います。

1. 静的コンテンツ（HTML）が期待通りに変換されるか？
2. 動的コンテンツ（PHP）が期待通りに変換されるか？
3. WordPressで作成したコンテンツが期待通りに変換されるか？

検証用で使ったガラケー

1. docomo PRIME series F-03A
2. docomo SO902i
3. docomo N905i
4. docomo S905i
5. AU URBANO（機種名：W63SH）

前提条件

• 検証に使用したスマートフォン向けのコンテンツを利用（画像サイズ等をスマートフォン用に編集されたコンテンツで且つ、複雑ではなくシンプルなDOM構造をもったHTML）

検証その１

• 静的HTMLでの検証結果についてはスマートフォン、ガラケーともに問題なく変換できました。但しガラケーで正しく変換させる為に若干調整を行いました。

調整箇所は

• bodyタグ内に埋め込んでいたalinkの値をalink="#ac7c37"からalink="#ffffff"に設定。vlink="#ac7c37"とlink="#ac7c37"はそのままで問題なし。（全てが#ac7c37（同色）で設定されているので変更）
• style.cssで max-width: 480px; と記述のあった部分を削除（iPadやAndroidタブレットにも対応させるため）

alinkを白色に変更しておかないとガラケーでリンク部分にフォーカスがあたった場合に 背景色と文字色が同じになってしまい、テキストが読めない状態になってしまいました。

検証その２

• 検証その１で使用した静的HTMLを拡張子PHPに変え、画像パス等をPHPで取得して動的にHTMLを生成するもので検証しました。（画像だけ動的取得なので、それ以外のHTMLタグは変更なし（静的HTMLで画像パスの取得を変更しただけのPHPテンプレートなので特になんの調整もなく、変換できることが検証できました。

調整箇所無し

検証その３

最後の関門であるWordPressで作成したコンテンツが期待通りに変換されるか？の検証ですが、ハマりました。

問題点として

• WordPressで登録したコンテンツでは一番の売りである画像が変換されない（アップロードした画像サイズでそのまま表示される）ため、スマートフォンでは当然表示されますが、ガラケーでアクセスすると速攻でページ容量オーバーとなってページが表示されない。

もしかしてWordPressには対応していないのだろうか？と一抹の不安がよぎりましたが、まずはroundaboutが動作しているか？の確認作業として

• 「DEVICE_GROUP」という文字列を含む記事をwordpressのテンプレートに記述したときに、アクセスした機種によって「PC」や「iPhone」などの切り替わるかどうかの確認する

これで「DEVICE_GROUP」という文字列が切り替わる場合は、roundaboutが動作している確認がとれます。文字が切り替わらない場合は、サーバモジュールのインストールが正しくできていないので、再度サーバモジュールをセットアップする必要がありますが、幸い「DEVICE_GROUP」という文字列が切り替わったので、roundaboutは正常に動作していることが確認できました。

では一体なにが原因なのか？と言うことですが、まずroundaboutの仕様として

1. ラウンドアバウトでは変換対象の画像が相対URLとして出力されている必要がある。
2. ラウンドアバウトではDirectoryディレクティブや.htaccessで設定されたmod_rewrite等を使ったURLの書き換えには対応していない。
3. ラウンドアバウトでは画像変換は元の画像の大きさを見て変換サイズを決めるので、widthやheightを前提としたコンテンツだと崩れてしまう

と言う事だそうです。FAQの最後に『Locationディレクティブでの設定をお試しください。』とあったので、roundabout.confにLocationディレクティブを設定してみましたが、やはりそう簡単には動作しませんでした。という事で次回の記事では上記の仕様を加味したサーバ側の設定変更等の手順をまとめたいと思います。